<template>
	<view class="content" v-show="show">
		<!-- 头部导航 -->
		<view class="w-750 w-bj-cont" style="position: fixed; top: 0; left: 0; z-index: 999;">
			<view class="h-100 w-row-justify-between-align">
				<view class="wh-80 w-row-center" @click="routerBack()">
					<image class="wh-40" src="../../../static/gane/fh.png"></image>
				</view>
				<view class="w-350 h-100 w-row-center w-wz-conts font-36">
					<text>结果记录</text>
				</view>
				<view class="wh-80 w-row-center">
					<!-- <uni-datetime-picker type="datetimerange" @change="changeTiem">
						<image class="wh-50" src="../../../static/gane/rq.png"></image>
					</uni-datetime-picker> -->
				</view>
			</view>
		</view>
		<view class="bwh-120"></view>
		<!-- 头部导航结束 -->
		
		<view class="list">
			<view class="item head">
				<view class="qihao">期号</view>
				<view class="number">开奖号码</view>
				<view class="zonghe">总和</view>
				<view class="jdx">极大小</view>
				<view class="bds">豹对顺</view>
			</view>
			<view class="item" v-for="(item, index) in tableData">
				<view class="qihao">{{item.issue}}</view>
				<view class="number">{{item.numarr.join(',')}}</view>
				<view class="zonghe">
					<text>{{item.bet_tema}}</text>
					<block v-for="name in item.bet_name">
						<block v-if="!['极大','极小','豹子','对子','顺子'].includes(name) && name.length==1">
							,<text style="color: #ff0000;" v-if="name=='大'">{{name}}</text>
							<text style="color: green;" v-if="name=='小'">{{name}}</text>
							<text style="color: blue;" v-if="name=='单'">{{name}}</text>
							<text style="color: yellow;" v-if="name=='双'">{{name}}</text>
						</block>
					</block>
				</view>
				<view class="jdx">
					<block v-for="name in item.bet_name">
						<text v-if="['极大','极小'].includes(name)">{{name}}</text>
					</block>
					<text v-if="!['极大','极小'].some(item2 => item.bet_name.includes(item2))">-</text>
				</view>
				<view class="bds">
					<block v-for="name in item.bet_name">
						<text v-if="['豹子','对子','顺子'].includes(name)">{{name}}</text>
					</block>
					<text v-if="!['豹子','对子','顺子'].some(item2 => item.bet_name.includes(item2))">-</text>
				</view>
			</view>
		</view>

		<view class="w-300 h-80  w-row-center w-bor-12">
			<text class="w-wz-conts font-28" v-if="ispage">没有更多数据了...</text>
		</view>

	</view>

</template>

<script>
	import $H from '@/pages/common/request.js'
	export default {
		data() {
			return {
				tableData: [],
				show: false,
				start_time: '',
				end_time: '',
				pagenum: 1,
				total: null,
				ispage: false
			}
		},

		onLoad(e) {
			this.getUserAgentLog()
		},

		onReachBottom() {

			// uni.showLoading({
			// 	title: '加载数据中...'
			// });
			// this.pagenum++
			// let timer = setInterval(() => {
			// 	uni.hideLoading();
			// 	if (this.tableData.length == this.total) {
			// 		this.ispage = true
			// 	} else {
			// 		this.getUserAgentLog()
			// 	}
			// 	clearTimeout(timer)
			// }, 600);

		},


		methods: {

			changeTiem(val) {
				this.start_time = val[0]
				this.end_time = val[1]
				this.tableData = []
				this.getUserAgentLog(true)
			},

			getUserAgentLog(isbool) {
				$H.post('/app_user_aomenjisu_redord', {
					pagenum: this.pagenum,
					start_time: this.start_time,
					end_time: this.end_time,
				}).then((res) => {
					console.log(res)
					if (res.code == 200) {
						if (isbool) {
							if (res.data.data.length == 0) {
								this.tableData = []
							} else {
								this.tableData.push(...res.data.data)
							}
						} else {
							this.tableData.push(...res.data.data)
							this.total = res.data.total
							this.show = true
						}


					} else {
						return uni.showToast({
							title: res.msg,
							duration: 1000,
							icon: 'none'
						});
					}
				})
			},

			


		}
	}
</script>

<style lang="less">
.list{
	width: 720rpx;
	margin: auto;
	background-color: #272727;
	border-radius: 12rpx;
	color: #ccb581;
	.item{
		padding: 24rpx 14rpx;
		text-align: center;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 36rpx;
		.qihao{
			width: 200rpx;
			font-size: 30rpx;
		}
		.number{
			width: 130rpx;
		}
		.zonghe{
			flex: 1;
			text{
				// display: inline-block;
			}
		}
		.jdx{
			width: 100rpx;
		}
		.bds{
			width: 100rpx;
		}
	}
	.head{
		font-size: 28rpx;
		padding: 14rpx;
	}
}
</style>
